<template>
  <div class="edu-page-warp">
    <condition-card @reset="reset" @search="onSubmit" label-width="110px" style="margin-bottom:16px;" >
      <el-row>
        <el-col :span="8">
          <el-form-item :label="$t('label.schoolTerm')">
            <CalendarSelect v-model="queryForm.calendarId"  @load-done="onSubmit"></CalendarSelect>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item :label="$t('examinationLevel.subject')">
            <dict-select v-model="queryForm.subject" :data="options.subjects" :plzSelect="true"/>
            <!-- <el-select v-model="queryForm.subject" >
              <el-option
                v-for="item in options.subjects"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select> -->
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item :label="$t('nonPublicCourseOpen.grade')" :error="(!queryForm.grade && !!queryForm.faculty) ? $t('culture.rules.plsChooseGrade'):''">
            <GradeSelect v-model="queryForm.grade"  :showAll="false"></GradeSelect>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row >
        <!-- <el-col :span="8">
          <el-form-item label="学院">
            <el-select v-model="queryForm.label" style="width: 80%;">
              <el-option
                v-for="item in options.trainingLevel"
                :key="item.value"
                :label="item.label"
                :value="item.value"
                :style="{textIndent:item.indent+'px'}"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="专业">
            <el-select v-model="queryForm.label" style="width: 80%;">
              <el-option
                v-for="item in options.trainingLevel"
                :key="item.value"
                :label="item.label"
                :value="item.value"
                :style="{textIndent:item.indent+'px'}"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>-->
        <el-col :span="8">
          <el-form-item :label="$t('label.college')">
            <DictSelect v-model="queryForm.faculty" :data="options.facultys"  @change="changeFaculty"></DictSelect>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item :label="$t('label.major')">
            <!--监听queryForm.faculty,发生变化后台自动查询且绑定专业-->
            <MyMajor
              :faculty="queryForm.faculty"
              :grade="queryForm.grade"
              v-model="queryForm.major"
             
            ></MyMajor>
          </el-form-item>
        </el-col>
        <el-col :span="8" v-if="examType">
          <el-form-item :label="$t('examinationLevel.isExam')">
              <dict-select v-model="queryForm.isExam" :data="options.isExams" :plzSelect="true"/>
          </el-form-item>
        </el-col>
        <el-col :span="8" v-else>
          <el-form-item :label="$t('examinationLevel.result')">
             <dict-select v-model="queryForm.examResults" :data="options.examResults" :plzSelect="true"/>
            <!-- <el-select v-model="queryForm.examResults" >
              <el-option
                v-for="item in options.examResults"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select> -->
          </el-form-item>
        </el-col>
      </el-row>
    </condition-card>
  </div>
</template>

<script>
import UTILS from "common/src/utils/utils";
import { queryDic } from "common/src/api/dictionary";
import MyMajor from "./MyMajor";

export default {
  name: "examinationSearch",
  components: { MyMajor },
  props:{
    examType:{
      type:Boolean,
      default:true
    }
  },
  data() {
    return {
      inputStyle: "80%",
      queryForm: {
        calendarId:null,
        subject:"",
        grade:"",
        faculty: "",
        major: "",
        isExam: "",
        examResults:""
      },
      options: {
        facultys:[],
        isExams:[],
        subjects:[],
        examResults:[]
      }
    };
  },
  mounted() {
    this.init();
  },
  methods:{
    init() {
      let yes = { label: this.$t("message.yes"), value: "1" };
      let no = { label: this.$t("message.no"), value: "0" };
      this.options.isExams.push(yes);
      this.options.isExams.push(no);
      //筛选条件字典查询
      let data = {
        lang: this.$store.getters.language || "cn",
        type: "allChild",
        keys: ["X_YX","X_KCKM","X_RXKSCJ"]
      };
      queryDic(data).then(res => {
        if (res.code == 200) {
          UTILS.fillSelect(
            {
              facultys: "X_YX",
              subjects:"X_KCKM",
              examResults:"X_RXKSCJ"
            },
            res.data,
            this.options
          );
        }
      });
      //this.onSubmit();
    },
    reset() {
      this.queryForm.calendarId = null;
      this.queryForm.subject = "";
      this.queryForm.grade = "";
      this.queryForm.faculty = "";
      this.queryForm.major = "";
      this.queryForm.isExam = "";
      this.queryForm.examResults ="";
      this.$emit("reset");
      this.onSubmit();
    },
    onSubmit(){
      this.$emit("onSubmit",this.queryForm);
    }
  }
};
</script>

<style scoped>
</style>
